<div class="row">
  <div class="col-xs-12">
    <!-- PAGE CONTENT BEGINS -->
    <div class="center">
      <div class="tabbable">
        <ul class="nav nav-tabs" id="myTab">
          <%@users.each do |item|%>
              <li class="active">
                <a href="<%= admin_gps_show_path(user_id:item.id) %>">
                  <%=item.name.present? ? item.name: 'user_' + item.id.to_s  %>
                </a>
              </li>
              <li class="active">
                <a href="<%= admin_gps_follow_path(user_id:item.id) %>" class="btn btn-info btn-sm">
                  跟踪
                </a>
              </li>
          <%end%>
        </ul>
        <div class="row">
          <div id="admin_users">
            <%= grid(@orders, show_filters: :when_filtered) do |g|
              g.column name: "#{t 'activerecord.attributes.defaults.id'}", attribute: 'id'
              g.column name: "#{t 'activerecord.attributes.order.sr'}", attribute: 'sr'
              g.column name: "#{t 'activerecord.attributes.order.phone'}", attribute: 'phone'
              g.column name: "#{t 'activerecord.attributes.order.name'}", attribute: 'name'
              g.column name: "#{t 'activerecord.attributes.order.order_date'}", attribute: 'order_date'
              g.column name: "#{t 'activerecord.attributes.order.is_in_release'}", attribute: 'is_in_release' do |task|
                {'0'=>'有保固','1'=>'过保固'}[task.is_in_release.to_s]
              end
              g.column name: "#{t 'activerecord.attributes.order.advise'}", attribute: 'advise'
              g.column name: "#{t 'activerecord.attributes.order.total_price'}", attribute: 'total_price'

              g.column do |c|
                ddd(c.id)
              end
            end %>

          </div>
            <div id="container" tabindex="0"></div>
        </div>
      </div>
    </div>
  </div>
</div>

<script type="text/javascript" data-turbolinks-eval="true">
  window.onload = init_gps();

  function init_gps(){
//  获取GPS位置
    get_gps();
  };

  //加载地图
  function upload_map(lastest_add ,center_add,gps_arr){
    var map = new AMap.Map('container', {
      resizeEnable: true,
      center: center_add,
      zoom: 13
    });
    // 点标记
    var marker_first = new AMap.Marker({
      icon: "http://webapi.amap.com/theme/v1.3/markers/n/mark_b.png",
      position: center_add
    });
    // 点标记
    var marker_last = new AMap.Marker({
      icon: "http://webapi.amap.com/theme/v1.3/markers/n/mark_b.png",
      position: lastest_add
    });
    // 连线覆盖
    var polyline = new AMap.Polyline({
      path: gps_arr,          //设置线覆盖物路径
      strokeColor: "#3366FF", //线颜色
      strokeOpacity: 1,       //线透明度
      strokeWeight: 5,        //线宽
      strokeStyle: "solid",   //线样式
      strokeDasharray: [10, 5] //补充线样式
    });
    marker_first.setMap(map);
    marker_last.setMap(map);
    polyline.setMap(map);
  };

  //获取 GPS信息
  function get_gps(){
    //每隔五秒执行
    setTimeout(get_gps,1000*5);
    var center_add,lastest_add,gps_arr;
    $.get("/api/homes/get_latest_gps", {user_id: <%=@user.id%>}, function (data) {
      gps_arr = data.gps_arr;
      lastest_add = data.lastest_add;
      center_add = data.center_add;
      //  加载地图信息
      upload_map(lastest_add,center_add,gps_arr);
    });
  };

</script>
<style type="text/css">
  #container{
    margin:0 auto;
    width:1100px;
    height: 600px;
  }
</style>


